<template>
    <el-dialog v-if="dialogVisible" :close-on-click-modal='false' title="信息确认" :visible.sync="dialogVisible" width="650px">
        <template v-if="meterialData.length>0">
            <div class="font_14 color_01">素材与账户不匹配信息</div>
            <div class="materila_height">
                <div class="materila_list" v-for="item in meterialData" :key="item">
                    {{item}}
                </div>
            </div>
        </template>
        <div class="materila_ok" v-else>素材与账户完全匹配</div>
        <span slot="footer" class="dialog-footer">
            <el-button size="small" class="el-button-width" @click="dialogVisible = false">取 消</el-button>
            <el-button size="small" type="primary" @click="submitForm()" class="el-button-width">下一步</el-button>
        </span>
    </el-dialog>
</template>

<script>
export default {
    props: ["dataForm"],
    name: "",
    data() {
        return {
            dialogVisible: false,
            meterialData:[],
        };
    },
    created() {},
    methods: {
        getData(data){
            this.dialogVisible = true
            this.meterialData = data
        },
        submitForm() {
            this.dataForm.step = 4;
            window.sessionStorage.setItem(
                "dataForm",
                JSON.stringify(this.dataForm)
            );
            this.dialogVisible = false
        },
    },
    components: {},
};
</script>


<style scoped>
.materila_list {
    font-size: 14px;
    color: #616c85;
    line-height: 24px;
    margin-top: 10px;
}
.materila_height {
    height: 300px;
    overflow-y: auto;
    line-height: 300px;
}
.materila_ok {
    text-align: center;
    font-size: 16px;
    color: #616c85;
    line-height: 40px;
}
</style>

